import React, { ReactElement, useState, Fragment } from 'react'
import { Rate } from 'antd'
import { connect } from 'umi'

interface Props {
    type?: string,
    changeScoresType: Function
}
// scores

// attack: 6  攻击
// difficulty: 4  难度
// skill: 5  技能
// survive: 7  生存

function MyRate({ type, changeScoresType }: Props): ReactElement {
    // 英雄定位难度指数
    const [grade, setGrade] = useState(0)
    return (
        <Fragment>
            <Rate
                count={10}
                value={grade}
                allowClear={false}
                onHoverChange={(item) => {
                    // setDegree(item)
                    if (item) {
                        setGrade(item)
                        changeScoresType(type, item)
                    } else {
                        if (grade) {
                            setGrade(grade)
                        } else {
                            setGrade(0)
                        }
                    }
                }} onChange={(item) => {
                    setGrade(item)
                }} /> &nbsp; {grade}
        </Fragment>
    )
}

export default connect((state: any) => {
    return {
        
    }
}, (dispatch) => {
    return {
        changeScoresType(classify: string, value: number) {
            dispatch({ type: "heroCard/changeScoresType", classify, value })
        }
    }
})(MyRate)
